<div class="page-crumb">
	<div class="ui-ctrl ui-crumb"><span class="ui-crumb-node ui-crumb-node-first ui-crumb-node-last">新建广告</span></div>
</div>

<div class="layui-main">
	<form class="layui-form" action="" onsubmit="return false">
		<div class="layui-form-item">
			<label class="layui-form-label">所属订单：</label>
			<div class="layui-input-inline">
				<select name="o_id" lay-filter="">
					<option value="">请选择...</option>
					<foreach name="orders" item="vo" key="k">
						<option value="{$vo.id}">{$vo.order_name}</option>
					</foreach>

				</select>
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">广告名称：</label>
			<div class="layui-input-inline">
				<input type="text" name="ad_name" lay-verify="ad_name" autocomplete="off" placeholder="请输入广告名称" class="layui-input">
			</div>
			<div class="layui-form-mid layui-word-aux">少于130个字符</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">售卖方式：</label>
			<div class="layui-input-block">
				<input type="radio" name="sale_mode" value="1" data-state="" title="直投" checked="">
				<input type="radio" name="sale_mode" value="2" data-state="" title="竞价">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">计费方式：</label>
			<div class="layui-input-block">
				<input type="radio" name="billing_mode" value="1" title="CPD">
				<input type="radio" name="billing_mode" value="2" title="CPM" checked="" >
				<input type="radio" name="billing_mode" value="3" title="CPC">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">单价：</label>
			<div class="layui-input-inline">
				<input type="text" name="price" autocomplete="off" placeholder="100.00元" class="layui-input">
			</div>
			<div class="layui-form-mid layui-word-aux">元</div>
		</div>


		<div class="layui-form-item">
			<label class="layui-form-label">载体类型：</label>
			<div class="layui-input-block">
				<input type="radio" name="carrier_type" value="1" title="H5" checked="">
				<input type="radio" name="carrier_type" value="2" title="移动端">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">目标代码位：</label>
			<div class="layui-input-inline">
				<select name="media"  lay-verify="media" lay-filter="media">
					<option value="">请选择媒体...</option>
					<foreach name="media" item="vo" key="k">
						<option value="{$vo.id}">{$vo.name}</option>
					</foreach>

				</select>
			</div>
			<div class="layui-input-inline">
				<select name="code_id" id="code_id" lay-filter="code_id">
					<option value="">请选择代码位...</option>
				</select>
			</div>
		</div>

		<div class="layui-form-item hour">
			<label class="layui-form-label">投放时间：</label>
			<div class="layui-input-block">
				<input type="radio" name="delivery_time_set" lay-filter="delivery_time_set" value="1" title="连续时间" checked="">
				<input type="radio" name="delivery_time_set" lay-filter="delivery_time_set" value="2" title="不连续时间">
				<!--6.26   18:36-->
				<div class="test" style="background: #F8F8F8;width: 470px;height: auto">
					<!--连续-->
					<div class="layui-form-item" id="startTime" style="padding-top: 20px">
						<label class="layui-form-label">开始时间：</label>
						<div class="layui-inline">
							<!--<input class="layui-input" name="startTime" placeholder="请选择开始时间" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm:ss'})">-->
							<div class="layui-input-inline" style="width: 120px">
								<input id="begin-month" class="layui-input" name="startTime" placeholder="请选择开始时间" onclick="layui.laydate({elem: this, festival: true})" style="width: 120px;background: #ebebeb;background-image: url('../../../static/backend/image/calendar.png');background-repeat: no-repeat;background-size: 15px;background-position: 100px 8px;border: none;position: relative;font-size: .8em;">
							</div>

							<!--<img src="../../../static/backend/image/calendar.png" style="width: 15px;height: 15px;position: absolute;top: 6px;right: 5px;">-->

							<div class="layui-input-inline">
								<select id="begin-time" name="begin_time">
									<?php for($i = 0; $i <= 24; $i ++) {
										if(strlen($i) == 1) {
											echo "<option>0$i:00</option>";
										} else {
											echo "<option>$i:00</option>";
										}
									}?>
								</select>
							</div>
							<!-- <input name="" type="hidden" value="" id="inputselect"/> -->
						</div>
					</div>

					<div class="layui-form-item" id="endTime">
						<label class="layui-form-label"style="padding-bottom: 20px">结束时间：</label>
						<!--<div class="layui-inline">-->
							<!--<input class="layui-input" name="endTime" placeholder="请选择结束时间" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm:ss'})"style="width: 120px;background: #ebebeb;border: none;font-size: .8em">-->
						<!--</div>-->
						<input type="radio" name="end_time_set" lay-filter="end_time_set" value="0" title="不限结束时间" checked="">
						<input class="isChecked" type="radio" name="end_time_set" lay-filter="end_time_set" value="1" title="设定结束时间">
						<div class="is-set-end" style="margin-left: 130px">

							<div class="layui-input-inline" style="width: 120px">
								<input class="layui-input endTime" name="endTime" placeholder="请选择结束时间" onclick="layui.laydate({elem: this, festival: true})" style="width: 120px;background: #ebebeb;background-image: url('../../../static/backend/image/calendar.png');background-repeat: no-repeat;background-size: 15px;background-position: 100px 8px;border: none;position: relative;font-size: .8em;">
							</div>


							<!--<img src="../../../static/backend/image/calendar.png" style="width: 15px;height: 15px;position: absolute;top: 6px;right: 5px;">-->

							<div class="layui-input-inline" style="padding-bottom: 20px">
								<select id="end-time" name="end_time">
									<?php for($i = 0; $i <= 24; $i ++) {
										if(strlen($i) == 1) {
											echo "<option>0$i:00</option>";
										} else {
											echo "<option>$i:00</option>";
										}

									}?>
								</select>
							</div>
						</div>
					</div>

					<!--不连续-->

					<div class="layui-form-item" id="timeList">
						<label class="layui-form-label"style="padding-bottom: 20px">请选择时间：</label>
						<input name="interval_time" hidden>
						<div class="layui-input-inline" style="width: 100px">
							<input id="add-month" class="layui-input" name="intervalTime" placeholder="请选择日期" onclick="layui.laydate({elem: this, festival: true})">
						</div>

						<!--<img src="../../../static/backend/image/calendar.png" style="width: 15px;height: 15px;position: absolute;top: 6px;right: 5px;">-->

						<div class="layui-input-inline" style="padding-bottom: 20px">
							<select id="add-begin">
								<?php for($i = 0; $i <= 24; $i ++) {
									if(strlen($i) == 1) {
											echo "<option>0$i:00</option>";
									} else {
										echo "<option>$i:00</option>";
									}
								}?>
							</select>
						</div>
						<div class="layui-input-inline" style="padding-bottom: 20px">
							<select id="add-over">
								<?php for($i = 0; $i <= 24; $i ++) {
									if(strlen($i) == 1) {
											echo "<option>0$i:00</option>";
									} else {
										echo "<option>$i:00</option>";
									}
								}?>
							</select>
						</div>
						<button id="add-time" class="layui-btn layui-btn-small"><i class="layui-icon"></i></button>
						<div id="choose-already" ></div>
					</div>

				</div>
			</div>
		</div>
		
		<div class="layui-form-item">
			<label class="layui-form-label">投放上限：</label>
			<div class="layui-input-inline">
				<input type="text" name="delivery_limit" autocomplete="off" placeholder="设置投放上限【展现次数】" class="layui-input">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">每日投放量：</label>
			<div class="layui-input-inline">
				<input type="text" name="daily_delivery_limit" autocomplete="off" placeholder="限制每日投放数量【每天展现次数】" class="layui-input">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">频次控制：</label>
			<div class="layui-input-inline">
				<input type="text" name="frequency_limit" autocomplete="off" placeholder="限制对独立访客的展现次数" class="layui-input">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">广告物料：</label>

			<div id="id-list" class="layui-table list-content-table" lay-skin="nob">
				<table class="list-table-body">
					<colgroup>
						<col width="100">
						<col width="200">
						<col width="200">
						<col width="200">
						<col width="200">

					</colgroup>
					<thead class="list-table-head">

					</thead>
					<tbody class="listBox">

					</tbody>
				</table>
			</div>

			<a class="ui-link skin-add-link" href="javascript:;" id="add_ad" target="">从物料库中选择</a>

		</div>

		<div class="layui-form-item">
			<div class="layui-input-block">
			  <button class="layui-btn" lay-submit="" lay-filter="submit" id="save">　　保存　　</button>
			  <button class="layui-btn layui-btn-primary close-btn" onclick="PopModel.closeFrame();">取消</button>
			</div>
		</div>
		
	</form>
	
</div>
<script src="__BACKEND_STATIC__/js/AdDelivery/add.js"></script>

<script>
	var ids = [];
	$('#add_ad').on('click', function () {
        layer.open({
			title:'广告物料列表',
            type: 2,
            area: ['1200px', '700px'],
            fixed: false, //不固定
            maxmin: true,
            content: '/AdDelivery/ad_lists'
        });
    });

	function parentFunction(param){
	    var count = param.length;
	    if(count <= 0) return;
	    console.log(ids);
	    for (var i=0; i<count; i++){
        	if( ids.indexOf( param[i]['id'] ) != -1){
        	    continue;
			}
	        var html = "<tr data-id=" + param[i]['id'] + ">";
	        	html += "<td class='ui-table-cell'><div class='ui-table-cell-text'> "+ param[i]['id'] +"</div></td>";
            	html += "<td class='ui-table-cell'><div class='ui-table-cell-text'> "+ param[i]['name'] +"</div></td>";
            	html += "<td class='ui-table-cell'><div class='ui-table-cell-text'> "+ "<img width='160px' height='100px' src=" + param[i]['img']+ ">" +"</div></td>";
            	html += "<td class='ui-table-cell'><div class='ui-table-cell-text'> "+ param[i]['size'] +"</div></td>";
				html += "<td class='ui-table-cell'><div class='ui-table-cell-text'><button id=" + param[i]['id'] +" class='layui-btn layui-btn-primary close-btn delBtn'>移除</button></div></td>";
            	html += "</tr>";

            	$(".listBox").append(html);

            ids.push(param[i]['id']);
        }

	}
	
	$(".listBox").on("click", '.delBtn', function () {
	    var parentDom = $(this).parents("tr");
	    var id = parentDom.attr('data-id');
	    var index = ids.indexOf(id);
	    ids.splice(index, 1);
        parentDom.remove();
    });

//	6.28  16:28  甘萍
//	textarea添加时间

	$('#add-time').on("click",function () {
        var month = $('#add-month').val();
        var begin = $('#add-begin').val();
        var over = $('#add-over').val();
        var addTime = month + ' ' + begin + '-' + over;
        var time = '<p class="add-p" style="margin-left: 70px;margin-bottom: 15px;">' + addTime + '<span style="cursor: pointer;color: #ffffff;display: inline-block;width: 15px;height: 15px;background: #12bdce;border-radius: 50%;text-align: center;line-height: 15px;margin-left: 15px;" id="del-add">x</span>' + '</p>';

		var len = $('#choose-already p').length;
        var allText = $('#choose-already p').text();
        var arr = allText.split('x',len);
        var status = false;

        if(month != '' && begin != '' && over != ''){

			for(var i = 0; i<= arr.length; i++){
                if(arr[i] == addTime){
                    status = true;
                    alert("有了")

				}
			}
			if(!status){
                $('#choose-already').append(time);
                var afterLen = $('#choose-already p').length;
                var afterText = $('#choose-already p').text();
                var intervalTime = afterText.split('x',afterLen);
                $("input[name='interval_time']").val(intervalTime);
			}

		}else{
            alert('请填写完整日期')
		}
    })

    $(document).on('click', '#del-add', function() {

        $(this).parent().remove()
    });

</script>
